<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { useRoute } from 'vue-router'

// 图片导入方式修改 👇
import hehongcha from '@/assets/img/ecoProduce/img/hehongcha.png'
import hongyayu from '@/assets/img/ecoProduce/img/hongyayu.png'
import yanshantangfen from '@/assets/img/ecoProduce/img/yanshantangfen.png'
import maciguo from '@/assets/img/ecoProduce/img/maciguo.png'
import dengzhanguo from '@/assets/img/ecoProduce/img/dengzhanguo.png'

import sizhi from '@/assets/img/ecoProduce/img/sizhi.png'
import huanggangshan from '@/assets/img/ecoProduce/img/huanggangshan.png'
import mingqingguzhen from '@/assets/img/ecoProduce/img/mingqingguzhen.png'
import taiyuanshezu from '@/assets/img/ecoProduce/img/taiyuanshezu.png'
import gexianshan from '@/assets/img/ecoProduce/img/gexianshan.png'


const route = useRoute()
const productName = ref(route.params.name as string)
console.log(productName.value)
const productInfo = {
  hehongcha: {
    desc: '河红茶全称为河口红茶。河红茶因原产地在江西上饶铅山县河口镇而得名。 最早的红茶——小种红茶，产于以桐木关为中心的武夷山地区。 18世纪20年代，晋商发现了游牧民族对茶叶的需求，深入到优质的产茶地武夷山脉，开始是收购茶叶，后来承包茶山，雇佣成千上万农民从事采茶及砖茶的加工。各地茶叶由挑夫挑到铅山河口，装船外运。',
    img: hehongcha
  },
  hongyayu: {
    desc: '红芽芋是芋类品种之一，属广东农家品种，种植历史悠久，多在田边、地边、厢边作边际栽培。红芽芋含淀粉较多，品质鲜美、细腻，粉而不粘，口感好，蒸煮熟食，营养全面。鲜芋食用，也可干制。',
    img: hongyayu
  },
  yanshantangfen: {
    desc: '麻糍粿是江西上饶和福建武夷山民间的一种特色小吃。麻糍粿就是将蒸熟蒸烂的糯米放在特制的石槽（叫“臼”）里用木质的锤子捣烂之后在外面裹上碾碎的炒豆、芝麻、白砂糖等而成的一种甜食。 在民间也通常被称为“麻子果”，在上饶也有将其与油条混在一起吃的“油条夹麻子果”。',
    img: yanshantangfen
  },
  maciguo: {
    desc: '麻糍粿是江西上饶和福建武夷山民间的一种特色小吃。麻糍粿就是将蒸熟蒸烂的糯米放在特制的石槽（叫“臼”）里用木质的锤子捣烂之后在外面裹上碾碎的炒豆、芝麻、白砂糖等而成的一种甜食。 在民间也通常被称为“麻子果”，在上饶也有将其与油条混在一起吃的“油条夹麻子果”。',
    img: maciguo
  },
  dengzhanke: {
    desc: '灯盏粿是江西省上饶市铅山县的地方特色小吃。因外形呈灯盏状而得名，外皮由大米制成，中间添馅，馅大多数有新鲜香菇，鲜猪肉，黄豆芽，鲜竹笋等（也可因个人口味不同酌情增减），最后放入竹制小蒸笼中用大火蒸半小时左右即可，色香味俱全，食后回味无穷，齿颊留香。',
    img: dengzhanguo
  },

  sizhi: {
    desc: '  四纸制作技艺是铅山连四纸制作技艺，江西省铅山县地方传统手工技艺，国家级非物质文化遗产之一。\n' +
        '连四纸，又叫“连泗纸”，纸质较厚者又称为“海月纸”。其名字由来十分有趣，据说连四纸是由福建邵武连姓兄弟经过多年研制，精工抄造而成，因他们排行老三、老四而得名。 \n' +
        '  2006年，铅山连四纸制作技艺经中华人民共和国国务院批准列入第一批国家级非物质文化遗产名录',
    img: sizhi
  },
  huanggangshan: {
    desc: '黄岗山，也称作“黄冈山”，是福建省和江西省的界山。位于福建省武夷山市洋庄乡和江西省上饶市铅山县武夷山镇和境内，山的南麓属于福建省，北麓属于江西省锚点 。 \n' +
        '黄岗山是武夷山脉最高峰，是整个华东六省一市地区的最高山峰，介于北纬27°33 —27°54ˊˊ ，东经117°27 —117°51ˊˊ之间。其最高峰海拔2160.8米，为大陆东南第一峰，号称“华东屋脊”、“武夷支柱”。山顶有江西省和福建省的界碑，福建省于1990年所立的“武夷第一峰”的石碑，而后江西省于1997年立的\'\'黄冈山\'\'的石碑。',
    img: huanggangshan
  },
  gexianshan: {
    desc: '  葛仙山，位于江西省上饶市铅山县葛仙山镇，地处武夷山北麓，上饶市铅山县中部，系武夷山支脉，东连上饶、西邻弋阳，与320国道和浙赣铁路相接 ，面积为30.06平方千米。 \n' +
        '  葛仙山属燕山期花岗岩型地貌，集中奇峰、异石、古树、云海、清泉等地貌，主峰葛仙峰海拔1096.3米。葛仙山属中亚热带季风湿润气候区，气候温和，雨量充沛，四季分明 ，年平均气温为13.7℃，无霜期约250天，年降水量1700毫米。 \n' +
        '  葛仙山自然景观和人文景观丰富，道家文化浓厚 ，具有“一山两教、道佛双修”的宗教特色，为道教名山，有“中华灵宝第一山”的称号。',
    img: gexianshan
  },
  mingqingguzhen: {
    desc: '河口明清古街，被省、市文物专家称为江西第一古街。2013年6月，河口镇明清古街入选中国国历史文化名街。2014年3月，河口镇被评为中国历史文化名镇。如今，这里仍保留着旧时繁华的印记和古朴的风貌。沿河五百米长的明清古街，层楼绵延，鳞次栉比，古老而典雅；青石板路面上的道道车辙，记录下当年小镇的繁荣。镇内小河蜿蜒回转，一座座青石桥横跨两岸，增添了小镇的水乡情调。沿江码头的碑石上，字迹历历可见，令人回想起当年“货聚八闽川广，语杂两浙淮扬，舟楫夜泊，绕岸灯辉”之盛。',
    img: mingqingguzhen
  },
  taiyuanshezu: {
    desc: '太源畲族乡，因乡人民政府驻太源村而得名。太源畲民虽与汉族杂居，但其本民族文化依然保留的非常完整。畲族有自己独特的语言，属汉藏语系苗瑶语族。\n' +
        '太源畲民大多能歌善舞，尤其民歌文化甚为深厚。在《铅山县民歌集》收录的101首民歌中，有三分之一为畲族民歌。《先五方》、《仗脚司》被省有关部门定为江西省民间舞蹈重点节目，并被《中国民族民间舞蹈集成 江西卷》编辑部制成录像长期保存。《高皇歌》《封金山》《时辰歌》《畲族婆娘赶庙会》《竹杆舞》等被广大群众所熟知。',
    img: taiyuanshezu
  },

}

const product = ref({
  desc: '',
  img: ''
})

onMounted(() => {
  if (productInfo[productName.value]) {
    product.value = productInfo[productName.value]
  } else {
    product.value.desc = '暂无该产品的详细介绍。'
    product.value.img = '' // 可设置一个默认图片路径
  }
})
</script>
<template>
  <div class="product-detail-container">
<!--    <h2>{{ productName }}</h2>-->
    <p>{{ product.desc }}</p>
    <img :src="product.img" :alt="productName" v-if="product.img" />
  </div>
</template>

<style scoped>.product-detail-container {
  padding: 20px;
  color: #333;
  max-width: 800px;
  margin: auto;
}
.product-detail-container h2 {
  font-size: 24px;
  margin-bottom: 15px;
}
.product-detail-container p {
  font-size: 16px;
  line-height: 1.6;
  margin-bottom: 20px;
}
.product-detail-container img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}
</style>
